<template>
	<view>
		<uni-nav-bar left-icon="arrowthinleft" title="发布视频" :border="false" :fixed="true" bg="bg-fff" color="#333"
			@clickLeft="goBack()"></uni-nav-bar>
		<view class="w100 bg-f7f7f7" style="height: 10rpx;"></view>
		<view class="padding-x-24 padding-y-10 flex align-center justify-between solid-bottom">
			<view class="fs-26 color-333">标题<text class="color-zhuse">*</text></view>
			<input type="text" v-model="subInfo.title" class="fs-26 color-aaa flex1 text-right h40" placeholder="请输入标题">
		</view>
		<view class="padding-x-24 margin-top-30 fs-26 color-333">视频封面<text class="color-zhuse">*</text> </view>
		<view class="flex align-center justify-between padding-x-24 margin-top-30">
			<view class="w33 margin-right-30 text-center">
				<view @tap="uploadImg()" class="img_box flex1 flex align-center justify-center">
					<image v-if="!thumb" src="../../static/img/add_icon.png" class="add_icon"></image>
					<image v-else :src="thumb" class="w100" style="height: 100%;"></image>
				</view>
				<view class="fs-26 color-999 margin-top-20">上传封面</view>
			</view>
		</view>
		<view class="padding-x-24 margin-top-30 fs-26 color-333">视频<text class="color-zhuse">*</text> </view>
		<view class="flex align-center justify-between padding-x-24 margin-top-30">
			<view class=" margin-right-30 text-center" style="width: 60%;">
				<view  @tap="uploadVideo()"  class="img_box flex1 flex align-center justify-center" style="height: 400rpx;">
					<image  v-if="!attachment" src="../../static/img/add_icon.png" class="add_icon"></image>
					<video  v-else  :src="attachment"   style="height: 80%;width: 80%;"></video>
				</view>
				<view class="fs-26 color-999 margin-top-20">上传视频</view>
			</view>
		</view>

		<view class="padding-x-60 margin-y-48 padding-bottom-30">
			<view @tap="submit()" class="callBtn color-fff radius60 h40 fs-28 text-center">确定</view>
		</view>

	</view>
</template>

<script>
	import config from '@/config/index.config.js'
	export default {
		data() {
			return {
				subInfo: {
					attachment_id: "",
					thumb: "",
					title: "",
				},
				attachment: "",
				thumb: "",
			}
		},
		onLoad() {},
		methods: {
			uploadImg(type) {
				this.$tool.upload().then(res => {
					// console.log(res)
					this.thumb = res.showImg;
					this.subInfo.thumb = res.id;
				})
			},

			uploadVideo() {
				var that = this;
				uni.chooseVideo({
					sourceType: ['camera', 'album'],
					compressed:false,
					success: function(res) {
						uni.uploadFile({
							url: config.baseUrl + '/system/basic/uploadFile', 
							filePath: res.tempFilePath,
							name: 'file',
							/* formData: {
								type: type
							}, */
							header: {
								Authorization: uni.getStorageSync("hhToken")
							},
							success: r => {
								let imgData = JSON.parse(r.data)
								if(imgData.code == 1){
									that.attachment = imgData.path;
									that.subInfo.attachment_id = imgData.id;
								}
							}
						});
					}
				});
			},

			submit() {
				this.$api.release_video(this.subInfo).then(res => {
					this.$msg(res.msg)
					if (res.code == 1) {
						setTimeout(() => {
							uni.navigateBack()
						}, 400)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.img_box {
		border: 1rpx dashed #eee;
		height: 220rpx;

		.add_icon {
			width: 100rpx;
			height: 100rpx;
		}
	}

	.callBtn {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 60rpx;
		background: linear-gradient(to bottom, #FDA730, #FE810A);
	}
</style>
